﻿<%@ Page Title="" Language="C#" MasterPageFile="~/ShopNestedMasterPage.master" AutoEventWireup="true" CodeBehind="WebShopInex.aspx.cs" Inherits="Web.WebShopInex" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <link rel="stylesheet" type="text/css" href="css/reset.css" />
    <link rel="stylesheet" type="text/css" href="css/default.css">

    <!--主要样式-->
    <link rel="stylesheet" type="text/css" href="css/styles.css">
    <style>
        #divs2 {
            height: 400px;
            width: 800px;
            border: 1px solid hsla(0,0%,100%,0.27);
            border-radius: 5px;
            margin-right: auto;
            margin-left: auto;
            margin-bottom: 0 auto;
        }

        .item {
            cursor: pointer;
        }

            .item img {
                display: inline;
                width: 160px;
                height: 160px;
            }
    </style>
    <script src="js/lbt.js"></script>
    <div id="divs2"></div>

    <div style="clear: both"></div>
    <div class="wrapper">
        <div class="top" style="width: 100%; height: 40px;">
            <h1 class="title">推荐商品</h1>
            <span class="car" style=""><a href="WebShopCart.aspx" class="shopping-cart" style="width: auto; color: #fff; background-color: #333; line-height: 18px; font-size: 20px; padding: 4px 20px;">购物车</a></span>
        </div>


        <div class="clear"></div>
        <!-- items -->
        <div class="items">
            <%foreach (var item in list) %>
            <%{ %>
            <div class="item " vals="<%=item.Id %>">
                <img src="<%=item.imgpath %>" alt="item" vals="<%=item.Id %>" />
                <h2><%=item.name %></h2>
                <span style="font-size: 12px;">销量 :<em><%=item.sellnums %></em></span>
                <p>
                    价格: <em>$<%=item.prices.ToString("f2") %></em>
                </p>
                <button class="add-to-cart" vals="<%=item.Id %>"  type="button">添加到购物车</button>
              
            </div>
            <% } %>
        </div>
        <!--/ items -->
    </div>

    <script>
        //调用
        var imgs = ["img/t1.jpg", "img/t2.jpg", "img/t3.jpg", "img/t4.jpg"]
        var hrefs = ["", "#2", "#3", "#4"]
        var lbt = lbimg("divs2", imgs, hrefs, 3000).start()
    </script>
    <script src="js/jquery.min.js"></script>
    <script src="js/jquery-ui.min.js"></script>
    <script src="js/plugins/layer/layer.min.js"></script>
    <script type="text/javascript">
        $('.add-to-cart').on('click', function () {

            var Id = $(this).attr('vals');
            $.ajax({
                type: 'post',
                url: '../Hanlder/GoodsHandler.ashx?Method=AddCart',
                data: { Id: Id },
                success: function (data) {

                    var res = $.parseJSON(data);

                    if (res.states == 1) {
                        alert(res.msg);
                    } else {
                        alert('操作成功');
                        location.reload();;
                    }

                }
            });
        });

   


        $('.item img').on('click', function () {

            var Id = $(this).attr('vals');
            location.href = "WebShopInfo.aspx?Id=" + Id;
        });
    </script>
</asp:Content>
